<div class="bg-light lter b-b wrapper-md">
  <h1 class="m-n font-thin h3">转码方案管理</h1>
</div>
<div class="wrapper-md">
  <div class="row">
   
  <div class="col-sm-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        <!--  这里可以写头部 -->
      </div> 
      <div  ng-controller="dataTablesCtrl">
        <div class="row">
          <div class="col-sm-12" >
            <div class="panel-heading">
              <a  href="javascript:void(0);" ng-click="goAdd();" ><button class="btn btn-default btn-sm "><i class="fa fa-plus fa-lg"></i>&nbsp; 新增</button></a>

              <a href="javascript:void(0);" ng-click="goRemove();" ><button class="btn btn-default btn-sm "><i class="fa fa-trash-o fa-lg"></i>&nbsp; 批量删除</button></a>

              <!--隐藏域-->
              <input type="hidden" id ="optIds" name="optIds">
            </div>
          </div>
        </div>
        <table id="myTable" class="table table-striped m-b-none"></table>
      </div>
    </div>
  </div>
</div>
</div>
<!--样式-->
<style type="text/css">  
  div#rMenu {position:absolute; visibility:hidden; top:0; background-color: #555;text-align: left;padding: 2px;}  
  div#rMenu a{  
    cursor: pointer;  
    list-style: none outside none;  
  }  

  .selected {
    background-color: #DFF0D8;
  }
  
  /* dataTables列内容居中 */
  .table>tbody>tr>td{
    text-align:center;
  }

  /* dataTables表头居中 */
  .table>thead:first-child>tr:first-child>th{
    text-align:center;
  }
</style>
<!--样式-->
<script type="text/javascript">

//angularjs总控制器
app.controller('dataTablesCtrl', function($scope, $http,$state) {



$scope.goAdd = function () {

 var classId=  $("#operation").val();
 $state.go('app.transcoding.transcodingEdit');
};

//删除操作
$scope.goRemove = function () {
  var optIds = $('#optIds').val();
  if(''==optIds){
    top.layer.msg('请至少选择一项', {icon: 6});
    return false;
  }
  top.layer.confirm('您确定删除这些信息吗', function(index){
    var arr  =  optIds.split(',')
    for(var i =0;i<arr.length;i++){
      var detailUrl  =  API_URL +"file_transcode_template?query=delflag:0,Id:"+ arr[i];
      var detail = MY_ASYNC_AJAX(detailUrl);
      var formData = detail[0];
      formData.delflag = '1';
      var delUrl =   API_URL+"file_transcode_template";
      $.ajax({  
                  async : false, //是否异步  
                  cache : false, //是否使用缓存  
                  type : 'put', //请求方式,post  
                  dataType : "json", //数据传输格式  
                  url : delUrl+'/'+arr[i], //请求链接  
                  data: JSON.stringify(formData),
                  error : function() {  
                    console.log('亲，网络有点不给力呀！');  
                  },  
                  success : function(data) { 
                    
                  }  
                }); 

    }
    top.layer.close(index);

    top.layer.msg('删除成功', {icon: 6});
         //2.重新加载mytable
         var table = $('#myTable').DataTable();
         table.ajax.reload( null, false );   
       });
};
});




function checkOne(){
  var optIds = '';
  $("input[name='ids']:checkbox:checked").each(function(){ 
    optIds+=$(this).val() +',';
  });
  if(''!=optIds){
    optIds = optIds.substring(0,optIds.length-1);
  }
  $('#optIds').val(optIds);
  console.log($('#optIds').val());
}



function checkAll(){
 var checklist = document.getElementsByName ("ids");
 var checkFarther = document.getElementById("allChecked");
 if(checkFarther.checked){
   for(var i=0;i<checklist.length;i++){
    checklist[i].checked = true;
  } 
}
else{
  for(var j=0;j<checklist.length;j++){
   checklist[j].checked = false;
 }
}

var optIds ='';
if(checkFarther.checked){
  $("input[name='ids']:checkbox:checked").each(function(){ 
    optIds+=$(this).val() +',';
  });
}else{
 optIds='';
}
if(''!=optIds){
  optIds = optIds.substring(0,optIds.length-1);
}
$('#optIds').val(optIds);

console.log($("#optIds").val());


}

var dtUrl =  API_URL +"file_transcode_template?query=delflag:0";


$(document).ready(function(){

 //初始化dataTable
 var table =  $('#myTable').DataTable({
  ajax: {  
    url: dtUrl,  
    success:function(json){
        //清空表格
        $('#myTable').dataTable().fnClearTable();  
        if(null==json){
          $('#myTable').dataTable().fnClearTable();  
        }else{
           $('#myTable').dataTable().fnAddData(json,true);  //刷下表格
         }  
       }
     },
     deferRender:true,
     Processing:true,
     aaSorting: [[4, "desc"]],
     buttons: [{
      extend: 'collection',
      text: 'Export',
      buttons: [ 'csv-flash', 'xls-flash', 'pdf-flash' ]
    }],
            //默认最后一列（最后更新时间）降序排列
            order: [[5, "desc"]],     
      //行创建完成后回调
      rowCallback: function (row, data, index) {
       
      },
      aoColumns: [
      {
        data : "Id",
        title: '<input type="checkbox" id="allChecked" name="allChecked" onclick="checkAll()" />',
        orderable: false , 
        render : function(data, type, full, meta) {
          return '<input type="checkbox" value="'+ data + '" name="ids" onclick="checkOne()"/>';
        }
      },
      { data: "Id",
      title: "ID"
    },
    { data: "TemplateName" ,
    title: "模板名称"
  },
 
{ data: "TemplateEnable"  ,
  title: "启用停用",
  render: function (data, type, row, meta) {
    if(row.TemplateEnable==1){
      return "<i style='color:#2e8ded;' title='启用' class='fa fa-spinner fa-spin'></i>"; 
    }else{
      return "<i  title='停用' class='fa fa-spinner fa-spin '></i>";
    }
  }
},
{ data: "AutoTranscode"  ,
  title: "是否自动转码",
  render: function (data, type, row, meta) {
    if(row.AutoTranscode==1){
       return "<i  title='是' class='label label-primary'>是</i>";
    }else{
      return "<i  title='否' class='label label-info'>否</i>"; 
    }
  }

},
{ data: "VideoDefinition"  ,
  title: "视频清晰度",
},
{ data: "FileFormat"  ,
  title: "文件格式",
},
{ data: "UpdateTime"   ,
  title: "更新时间",
  render: function (data, type, row, meta) {
    return getDateTime(data);
  }
}
],
columnDefs: [
  {
    targets:8,
    data: null,
    title: "操作",
    render: function (data, type, row, meta) {
      var href = '';
      href += "&nbsp;  <a href='#/app/transcoding/transcoding/edit/"+row.Id+"'>";
      href += "<i  title='编辑' class='fa fa-edit fa-lg'></i></a>";    
      href += "&nbsp;  <a href='javascript:void(0);' onclick=goDelete("
      + row.Id+ ")>";
      href += "<i  title='删除' class='fa fa-trash-o fa-lg'></i></a>";
      return href;
    }
  }
],
drawCallback: function( settings ) {
 

},

initComplete:function(data){
 
},
Paginate: true, 
language:{
  url: 'vendor/jquery/datatables/Chinese.json'
}
});
});  


//单条删除
function goDelete(id){
  top.layer.confirm('您确定删除吗', function(index){
    var detailUrl  =  API_URL +"file_transcode_template?query=delflag:0,Id:"+ id;
    var detail = MY_ASYNC_AJAX(detailUrl);
    var formData = detail[0];
    formData.delflag = '1';
    var delUrl =   API_URL+"file_transcode_template";
    $.ajax( {  
                  async : false, //是否异步  
                  cache : false, //是否使用缓存  
                  type : 'put', //请求方式,post  
                  dataType : "json", //数据传输格式  
                  url : delUrl+'/'+id, //请求链接  
                  data: JSON.stringify(formData),
                  error : function() {  
                    console.log('亲，网络有点不给力呀！');  
                  },  
                  success : function(data) { 
                    top.layer.msg('删除成功', {icon: 6});
                    $('#myTable').DataTable().ajax.reload(); 
                    
                  }  
                }); 
    top.layer.close(index);
  });
}

</script>
